import { Component, OnInit, ViewChild, ViewEncapsulation } from '@angular/core';
import { UiService } from '../../ui.service';
import { GB } from '../../../environments/environment';
import { TranslatePipe, TranslateService } from '@ngx-translate/core';
import { I18nService } from '../../core/i18n/i18n.service';
import { ActionSheetConfig, SkinType, ActionSheetComponent, ActionSheetService, SwiperComponent, RatingConfig } from 'ngx-weui';
import { MessageService } from './../../core/message.service';
import { InfiniteLoaderComponent } from 'ngx-weui/infiniteloader';
import { ApiService } from 'src/app/core/api';
import { Router, ActivatedRoute } from '@angular/router';
import { StorageService } from 'src/app/core/sotrage/storage.service';
import { fromEvent } from 'rxjs';

@Component({
	selector: 'app-index',
	templateUrl: './index.component.html',
	styleUrls: ['./index.component.less'],
	encapsulation: ViewEncapsulation.None,
})
export class IndexHomeComponent implements OnInit {
	@ViewChild('ios', { static: true }) iosAS: ActionSheetComponent;
	@ViewChild('android', { static: true }) androidAS: ActionSheetComponent;
	@ViewChild('auto', { static: true }) autoAS: ActionSheetComponent;
	@ViewChild(InfiniteLoaderComponent, { static: true }) il;
	@ViewChild('swiper', { static: true }) swiper: SwiperComponent;
	restartBtn = false;

	menus: any[] = [{ text: ' English', value: 'en', other: 1 }, { text: '中文', value: 'zh' }, { text: 'わご', value: 'jp' }];
	config: ActionSheetConfig = {
		title: 'Language changes',
	} as ActionSheetConfig;
	showLogin = false;
	token: string = null;
	gb = GB;
	lang = this.sto.get('lang') ? this.sto.get('lang') : 'zh';
	// list = [{}];
	options: any = {
		init: false,
		observer: true,
		observeParents: true,
		effect: 'coverflow',
		slideShadows: false,
		autoplay: true,

		pagination: {
			el: '.swiper-pagination',
		},
	};
	imgs;
	plays = [];
	list;
	caricatureList;
	user: any = null;
	customIconsAndClassCog: RatingConfig = {
		max: 5,
		stateOff: 'off',
		stateOn: 'on',
		cls: 'rating'
	}

	constructor(
		private i: I18nService,
		private api: ApiService,
		private sto: StorageService,
		private router: Router,
		private activeRouter: ActivatedRoute,
		private message: MessageService
	) {
		this.message.sendMessage('index');
	}
	pageData = {
		pageNo: 1,
		genre01Id: '',
		pages: 1
	};
	caricaturePageData = {
		pageNo: 1,
		name: '',
		pages: 1
	};
	subscribeScoll;
	isShowTop = false;
	ngOnInit() {
		this.getList('首页', this.pageData, 'main');
		// this.getList('热门游戏区', this.pageData, 'list');
		this.getplayList('最近在玩', {});
		// this.getList('首页产品推荐列表(首页轮播图)', {}, 'imgs');
		this.subscribeScoll = fromEvent(window, 'scroll').subscribe((event) => {
			this.isShowTop = document.documentElement.scrollTop > 0 ? true : false;
		});
		if (this.sto.get('user')) {
			this.user = this.sto.get('user');
			console.log(this.user['loginId']);
		} else {
			this.openLogin();
		}
		setTimeout(() => {
			this.swiper.swiper.init();
		});
	}
	tabs;
	getList(url, data, type) {
		this.api.post(url, data).then(res => {
			switch (type) {
				case 'main':
					this.pageData.pageNo = res['data']['productHotPlaceGameList']['pageNo'];
					this.pageData.pages = res['data']['productHotPlaceGameList']['pages'];
					this.list = res['data']['productHotPlaceGameList']['list'];
					this.imgs = res['data']['productBanner01List'];
					this.tabs = res['data']['gameGenreList'];
					this.selTabId = this.tabs[0].id;
					break;
				case 'list':
					this.pageData.pageNo = res['data']['pageNo'];
					this.pageData.pages = res['data']['pages'];
					let lists = res['data']['list'];
					if (this.pageData.pageNo == 1) {
						this.list = lists;
					} else {
						for (let i = 0; i < lists.length; i++) {
							this.list.push(lists[i]);
						}
					}
					break;
				case 'imgs':
					this.imgs = res['data']['list'];
					break;
				case 'plays':
					this.plays = res['data'];
					break;
				case 'playGame':
					this.router.navigate(['/gz'], {
						queryParams: res['data']
					});
					break;
				case 'caricatureList':
					this.caricaturePageData.pageNo = res['data']['pageNo'];
					this.caricaturePageData.pages = res['data']['pages'];
					let list = res['data']['list'];
					for (let i = 0; i < list.length; i++) {
						this.caricatureList.push(list[i]);
					}
					break;

				default:
					break;
			}
		}).catch(res => {
			return res;
		});
	}
	getplayList(url, data) {
		this.api.post(url, data).then(res => {
			this.plays = res['data'];
		}).catch(res => {
			console.log(res)
			return res;
		});
	}

	value;
	onSearch(term: string) {
		this.value = term;
		// if (term) this.items = this.tbService.search(term);
	}

	onCancel() {
		console.log('onCancel');
	}

	onClear() {
		console.log('onCancel');
	}

	onSel(tegId) {
		if (this.user) {
			this.getList('开始游戏', { id: tegId }, 'playGame')
		}
	}
	selTabId;
	onClick(item) {
		this.pageData.genre01Id = this.selTabId = item.id ;
		this.list = this.getList('热门游戏区', this.pageData, 'list');
	}
	dialogShow = false;
	onOutsize(bool) {
		this.dialogShow = bool;
	}
	chickOut() {
		this.dialogShow = false;
		this.sto.remove('user');
		location.href = location.origin + '/oauth/authorize?response_type=code&client_id=OwnUser&redirect_uri=' + location.origin;
	}
	cancel() {
		this.dialogShow = false;
	}
	gologin() {
		sessionStorage.removeItem('returnurl');
		location.href = location.origin + '/oauth/authorize?response_type=code&client_id=OwnUser&redirect_uri=' + location.origin;
	}
	openLogin() {
		this.showLogin = true;
	}
	loginSuccess() {
		if (localStorage.getItem('user')) {
			this.token = JSON.parse(localStorage.getItem('user'));
		}
	}
}
